<template>
	<view>
		<view class="status_bar03"></view>
		<view class="main01">
			<image class="bg_img" src="../../static/bg02.png"></image>
			<view class="wrap">
				<!-- <view class="she"><span class="iconfont" style="font-size: 6vw;" @tap="backPage">&#xe8c8;</span></view> -->
				<view class="she"></view>
				<view class="she"></view>
				<view class="a01">
					<view class="head" @click.stop="openImg"><image :src="url+name.avatar"  mode="scaleToFill"></image></view>
					<view class="b01">
						<view class="title" >
							<view class="name2"><label class="user">{{name.name|| '--'}}</label></view>
						</view>
						<!-- <view class="title" v-else>
							<view class="name2"><label class="user">{{name.sm_name}}</label>({{name.phone || '--'}})</view>
						</view> -->
						<view class="title" v-if="name != ''">
							<view class="grade">{{name.lv.name || ''}}</view>
						<!-- 	<view class="grade" v-if='name.ss==1'>服务中心</view>
							<view class="grade" v-if='name.is_tz==1'>行政服务</view> -->
						</view>
					</view>
				<!-- 	<view class="swtch_box">
						<view class="sign iconfont" :class="sign ? 'signcolor' : ''" @click.stop="setSign">&#xe60f;</view>
						<view class="text" v-if="!sign">签到</view>
						<view class="text" v-else>已签到</view>
					</view> -->
					<!-- <view class="swtch_box" @click="gotopage" data-url="/pages/personal/changeUser">
						<image class="img" src="../../static/change.png" mode="widthFix"></image>
						<view class="text">切换</view>
					</view> -->
				</view>
				<view class="total_amount" data-url="/pages/personal/surplus?type=1" @click="gotopage">
					<label class="t_t1" >账户余额：</label><label class="t_t2">{{name.y}}</label>
				<!-- 	<view class="btn" @click="gotopage" data-url="/pages/personal/transfer/gwb_transfer">充值</view> -->
				</view>
			<!-- 	<view class="a02"> -->
					<!-- <view class="total"><label class="logo iconfont">&#xe6b7;</label>账户余额：<label class="num">{{name.y}}</label></view> -->
					<!-- <view class="kuai" data-url="/pages/personal/surplus?type=1" @click="gotopage">
						<view class="mkbg">
							<view class="text">消费积分</view>
						</view>
						<view class="zimu">{{name.fh}}</view>
					</view>
					<view class="kuai" data-url="/pages/personal/surplus?type=6" @click="gotopage">
						<view class="mkbg">
							<view class="text">通兑积分</view>
						</view>
						<view class="zimu">{{name.y}}</view>
					</view>
					<view class="kuai" data-url="/pages/personal/surplus?type=3" @click="gotopage">
						<view class="mkbg">
							<view class="text">爆品积分</view>
						</view>
						<view class="zimu">{{name.j}}</view>
					</view>
					<view class="kuai" data-url="/pages/personal/surplus?type=8" @click="gotopage">
						<view class="mkbg">
							<view class="text">数权积分</view>
						</view>
						<view class="zimu">{{name.sq}}</view>
					</view> -->
					<!-- <view class="kuai" data-url="/pages/personal/surplus?type=1" @click="gotopage">
						<view class="mkbg">
							<view class="text">账户余额</view>
						</view>
						<view class="zimu">{{name.y}}</view>
					</view> -->
			
					<!-- <view class="kuai" data-url="/pages/personal/surplus?type=5" @click="gotopage">
						<view class="mkbg">
							<view class="text">联创积分</view>
						</view>
						<view class="zimu">{{name.c}}</view>
					</view> -->
			
			<!-- 	</view> -->
			</view>
			<view class="beig"></view>
		</view>
		
		<view class="nav">
			<view class="title_box" :data-url="'/pages/mylist/mylist?index=' + 0" @click="gotopage">
				<view class="text">我的订单</view>
				<view class="arrow_box">
					<view class="t">查看全部</view>
					<view class="arrow iconfont">&#xe775;</view>
				</view>
			</view>
		
			<view class="menu_box">
				<view class="menu" :data-url="'/pages/mylist/mylist?index=' + 1" @click="gotopage">
					<view class="icon"><image src="../../static/order/list01.png" mode="widthFix"></image></view>
					<view class="text01">待付款</view>
				</view>
				<view class="menu" :data-url="'/pages/mylist/mylist?index=' + 2" @click="gotopage">
					<view class="round" v-if="df>0">{{df}}</view>
					<view class="icon"><image src="../../static/order/list02.png" mode="widthFix"></image></view>
					<view class="text01">待发货</view>
				</view>
				<view class="menu" :data-url="'/pages/mylist/mylist?index=' + 3" @click="gotopage">
				<view class="round" v-if="ds>0">{{ds}}</view>
					<view class="icon"><image src="../../static/order/list03.png" mode="widthFix"></image></view>
					<view class="text01">待收货</view>
				</view>
				<view class="menu" :data-url="'/pages/mylist/mylist?index=' + 4" @click="gotopage">
					<view class="icon"><image src="../../static/order/list04.png" mode="widthFix"></image></view>
					<view class="text01">已完成</view>
				</view>
			</view>
		</view>
		<!-- <view class="nav nav02">
			<view class="title_box">
				<view class="text">分销中心</view>
				<view class="arrow_box">
				</view>
			</view>
		
			<view class="menu_box"> -->
				<!-- d -->
				
			<!-- 	<view class="menu" hover-class="uni_list_go" data-url="/pages/personal/register" @click="gotopage">
					<view class="icon"><image src="../../static/order/zhuce.png" mode="widthFix"></image></view>
					<view class="text01">注册账号</view>
				</view> -->
				<!-- <view class="menu" hover-class="uni_list_go" data-url="/pages/agent/withdraw" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_1.png"></image></view>
					<view class="text01">我的团队</view>
				</view> -->
				<!-- <view class="menu" hover-class="uni_list_go" data-url="/pages/personal/team_new/team_new" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_1.png" mode="widthFix"></image></view>
					<view class="text01">我的团队</view>
				</view> -->
			<!-- 	<view class="menu" hover-class="uni_list_go" data-url="/pages/personal/install/security" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_10.png" mode="widthFix"></image></view>
					<view class="text01">账号安全</view>
				</view>
				<view class="menu" hover-class="uni_list_go" data-url="/pages/share/share" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_8.png" mode="widthFix"></image></view>
					<view class="text01">邀请好友</view>
				</view>
				<view class="menu" hover-class="uni_list_go" data-url="/pages/depot/depot" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_22.png" mode="widthFix"></image></view>
					<view class="text01">我的仓位</view>
				</view> -->
				<!-- <view class="menu" hover-class="uni_list_go" data-url="/pages/personal/bonus" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_18.png" mode="widthFix"></image></view>
					<view class="text01">奖金池</view>
				</view> -->
				<!-- <view class="menu" hover-class="uni_list_go" data-url="/pages/personal/hang_sell/hang" @click="gotopage">
					<view class="icon"><image src="../../static/order/star.png" mode="widthFix"></image></view>
					<view class="text01">挂卖积分</view>
				</view>
				<view class="menu" hover-class="uni_list_go" data-url="/pages/personal/hang_sell/hang_sell" @click="gotopage">
					<view class="icon"><image src="../../static/order/hall.png" mode="widthFix"></image></view>
					<view class="text01">挂卖大厅</view>
				</view>
				<view class="menu" hover-class="uni_list_go" data-url="/pages/personal/hang_sell/hang_order" @click="gotopage">
					<view class="icon"><image src="../../static/order/order.png" mode="widthFix"></image></view>
					<view class="text01">挂卖订单</view>
				</view> -->
	<!-- 		</view>
		</view> -->
		<view class="nav nav02" >
			<view class="title_box">
				<view class="text">常用功能</view>
				<view class="arrow_box">
				</view>
			</view>
		
			<view class="menu_box">
			<!-- 	<view class="menu" hover-class="uni_list_go" data-url="/pages/personal/surplus" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_13.png" mode="widthFix"></image></view>
					<view class="text01">我的资产</view>
				</view> -->
			
				<!-- <view class="menu" hover-class="uni_list_go" data-url="/pages/personal/bank/bank" @click="gotopage" v-if='fff'>
					<view class="icon"><image src="../../static/order/list_4.png" mode="widthFix"></image></view>
					<view class="text01">银行卡</view>
				</view> -->
				<view class="menu" hover-class="uni_list_go" :data-url="'/pages/list/list'" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_12.png" mode="widthFix"></image></view>
					<view class="text01">进货列表</view>
				</view>
				<view class="menu" hover-class="uni_list_go" data-url="/pages/personal/team_new/team_new" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_1.png" mode="widthFix"></image></view>
					<view class="text01">我的分享</view>
			</view> 
				<view class="menu" hover-class="uni_list_go" data-url="/pages/personal/examine" @click="gotopage" v-if="is_gwb">
					<view class="icon"><image src="../../static/order/order.png" mode="widthFix"></image></view>
					<view class="text01">团队审核</view>
				</view>
				<view class="menu" hover-class="uni_list_go" data-url="/pages/personal/found" @click="gotopage">
					<view class="icon"><image src="../../static/order/zhuce.png" mode="widthFix"></image></view>
					<view class="text01">我的团队</view>
				</view>
				<view class="menu" hover-class="uni_list_go" data-url="/pages/index/team" @click="gotopage">
					<view class="icon"><image src="../../static/order/star.png" mode="widthFix"></image></view>
					<view class="text01">团队加入</view>
				</view>
				<view class="menu" hover-class="uni_list_go" data-url="/pages/index/rank" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_16.png" mode="widthFix"></image></view>
					<view class="text01">销售排行</view>
				</view>
				<view class="menu" hover-class="uni_list_go" data-url="/pages/address/address" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_7.png" mode="widthFix"></image></view>
					<view class="text01">地址管理</view>
				</view>
			<!-- 	<view class="menu" hover-class="uni_list_go" data-url="/pages/coupon/coupon" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_23.png" mode="widthFix"></image></view>
					<view class="text01">优惠券</view>
				</view> -->
				
				
				<view class="menu" hover-class="uni_list_go" data-url="/pages/personal/turntable/turntable" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_2.png" mode="widthFix"></image></view>
					<view class="text01">大转盘</view>
				</view>
				
				<!-- #ifdef APP-PLUS -->
					<view class="menu" hover-class="uni_list_go" @click="openMeiQiaChatView">
						<view class="round" v-if=" chat_unread_num > 0">{{chat_unread_num}}</view>
						<view class="icon"><image src="../../static/order/list_9.png" mode="widthFix"></image></view>
						<view class="text01">联系客服</view>
					</view>
				<!-- #endif -->
				
				<!-- #ifndef APP-PLUS -->
					<view class="menu" hover-class="uni_list_go" data-url="/pages/personal/service" @click="gotopage">
						<view class="icon"><image src="../../static/order/list_9.png" mode="widthFix"></image></view>
						<view class="text01">客服中心</view>
					</view>
				<!-- #endif -->
				
				<view class="menu" hover-class="uni_list_go" :data-url="'/pages/notice/noticecontent?id='+ab" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_8.png" mode="widthFix"></image></view>
					<view class="text01">关于我们</view>
				</view>
				<!-- <view class="menu" hover-class="uni_list_go" data-url="/pages/index/index" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_8.png" mode="widthFix"></image></view>
					<view class="text01">加盟政策</view>
				</view> -->
			
			</view>
		</view>
		
		<!-- <view class="nav" v-if='name.ss==1'>
			<view class="title_box">
				<view class="text">报单中心</view>
				<view class="arrow_box">
				</view>
			</view>
		
			<view class="menu_box">
				<view class="menu" hover-class="uni_list_go" data-url="/pages/personal/register" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_21.png" mode="widthFix"></image></view>
					<view class="text01">注册会员</view>
				</view>
			</view>
		</view> -->
		
		
				
				
			<!-- 	<view class="menu" hover-class="uni_list_go" data-url="/pages/personal/merchant" @click="gotopage" v-if='name.ss==1'>
					<view class="icon"><image src="../../static/order/list_19.png" mode="widthFix"></image></view>
					<view class="text01">商户中心</view>
				</view>
				<view class="menu" hover-class="uni_list_go" @tap="goScan">
					<view class="icon"><image src="../../static/order/list_20.png" mode="widthFix"></image></view>
					<view class="text01">扫一扫</view>
				</view> -->
				<!-- <view class="menu" hover-class="uni_list_go" data-url="/pages/agent/withdraw" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_1.png" mode="widthFix"></image></view>
					<view class="text01">我的团队</view>
				</view> -->
				<!-- <view class="menu" hover-class="uni_list_go" @click="search1">
					<view class="icon"><image src="../../static/order/list_14.png" mode="widthFix"></image></view>
					<view class="text01">经销商优品</view>
				</view> -->
				<!-- <view class="menu" hover-class="uni_list_go"  @click="search">
					<view class="icon"><image src="../../static/order/list_6.png" mode="widthFix"></image></view>
					<view class="text01">渠道商特供</view>
				</view> -->
				
				
				
				<!-- <view class="menu" hover-class="uni_list_go" data-url="/pages/personal/turntable/turntable" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_2.png" mode="widthFix"></image></view>
					<view class="text01">大转盘</view>
				</view> -->
				
				<!-- <view class="menu" hover-class="uni_list_go" data-url="/pages/personal/station/station" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_3.png" mode="widthFix"></image></view>
					<view class="text01">社区门店</view>
				</view>
				
				<view class="menu" hover-class="uni_list_go" data-url="/pages/personal/rank" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_15.png" mode="widthFix"></image></view>
					<view class="text01">积分排行榜</view>
				</view> -->
			<!-- 	<view class="menu" hover-class="uni_list_go" data-url="/pages/personal/shoppingRank" @click="gotopage" v-if="is_gwb">
					<view class="icon"><image src="../../static/order/list_18.png" mode="widthFix"></image></view>
					<view class="text01">购物币排名</view>
				</view> -->
				
				<!-- <view class="menu" hover-class="uni_list_go"  @click="search2">
					<view class="icon"><image src="../../static/order/list_16.png" mode="widthFix"></image></view>
					<view class="text01">产品股东</view>
				</view>
				<view class="menu" hover-class="uni_list_go" data-url="/pages/news/news?type=13" @click="gotopage">
					<view class="icon"><image src="../../static/order/list_17.png" mode="widthFix"></image></view>
					<view class="text01">任务中心</view>
				</view> -->
		<view class="footer">
			<view class="footer_btn" @click="exitFun">退出登录</view>
		</view>
		<view class="footer2">汉家承 版权所有</view>
		
	</view>
</template>

<script>
// #ifdef APP-PLUS
const mqModule = uni.requireNativePlugin("MeiQia-ChatPlugin");
let chat = '';
// #endif
import { pathToBase64, base64ToPath } from '../../common/image-tools.js'
export default {
	data() {
		return {
			is_gwb:0,
			ab:'',
			sign:false,
			lv:'',
			phone:'',
			con:0,
			j:0,
			y:0,
			b:0,
			name:'',
			ewm:'',
			img:'',
			nn:'',
			hot:[],
			df:0,
			fff:0,
			ds:0,
			url:this.Cfg.Setting.img,
			pupu_show: false,
			mannum:'FAKHSD',
			chat_unread_num:0,
		};
	},
onLoad() {
  // #ifdef APP-PLUS
  mqModule.initChatViewManger();
  // #endif
 },
	onShow() {
		// #ifdef APP-PLUS
		mqModule.initChatViewManger();
		// #endif

		
		let me = this;
		me.Net._get('myData',{},(res)=>{
			if(res.code ==1){
				//console.log(res.data)
				me.con=res.data.con
				me.lv=res.data.lv.name
				me.phone=res.data.phone1.phone
				me.j=res.data.j
				me.y=res.data.y
					me.b=res.data.b
				me.name=res.data
				me.df=res.data.df
				me.ds=res.data.ds
				me.img=res.data.avatar
				me.ewm=res.data.ewm
			    me.nn=res.data.nn
				me.sign=res.data.f
				me.ab=res.data.ab_id
				me.is_gwb=res.data.sh
					//me.hot=res.data.hot
			}
		});

		// #ifdef APP-PLUS
		chat = setInterval(function(){
			mqModule.getUnreadMessages((res)=>{
				//console.log(res)
				me.chat_unread_num = res.length;
			}); 
		},5000)
		// #endif
		
	},
	// onHide() {
	// 	// #ifdef APP-PLUS
	// 	mqModule.initChatViewManger();
	// 	mqModule.dismiss();
	// 	clearInterval(chat);
	// 	// #endif
	// },
	onUnload(){
		// #ifdef APP-PLUS
		mqModule.initChatViewManger();
		mqModule.dismiss();
		clearInterval(chat);
		// #endif
	},
	onShareAppMessage(res) {
	            return{
	                title: "汉家承",
	                path: "/pages/index/index",
	                imageUrl: '',
	                desc: "",
	                content: "",
	                success(res){
	                    uni.showToast({
	                        title:'分享成功'
	                    })
	                },
	                fail(res){
	                    uni.showToast({
	                        title:'分享失败',
	                        icon:'none'
	                    })
	                }
	            }
	        },
			onShareTimeline(res) {
			            //console.log("分享", res)
			      
			            return{
			                title: "汉家承",
			                path: "/pages/index/index",
			                imageUrl: '',
			                desc: " ",
			                content: " ",
			                success(res){
			                    uni.showToast({
			                        title:'分享成功'
			                    })
			                },
			                fail(res){
			                    uni.showToast({
			                        title:'分享失败',
			                        icon:'none'
			                    })
			                }
			            }
			        },
	methods: {
		openMeiQiaChatView() {
			mqModule.initChatViewManger();
			let that = this;
			//console.log( that.name.username,that.name.phone)
			this.chat_unread_num = 0;
			mqModule.setClientInfo({
			clientInfo:{
				name: that.name.username,
				tel:that.name.phone
				},
			override: true});
			mqModule.showMeiQiaChatView();
		},
		goScan(){
			
			// uni.navigateTo({
			// 	url: '/pages/personal/gotoscan?id='+1
			// });
			
			uni.scanCode({
				scanType: ['qrCode'],
				success: function(res) {
					//console.log('条码类型：' + res.scanType);
					//console.log('条码内容：' + res.result);
					let data = JSON.parse(res.result);
					uni.navigateTo({
						url:'/pages/personal/gotoscan?id='+res.result
					});
				}
			});
		},
		onPullDownRefresh() {
			let me = this; // 下拉监听事件
			setTimeout(function() {
					uni.stopPullDownRefresh();
			me.Net._get('myData',{},(res)=>{
				if(res.code ==1){
					me.con=res.data.con
					me.lv=res.data.lv.name
					me.phone=res.data.phone1.phone
					me.j=res.data.j
					me.y=res.data.y
					me.name=res.data
					me.img=res.data.avatar
					me.ewm=res.data.ewm
				    me.nn=res.data.nn
					me.sign=res.data.f
				}
			});
			}, 500);
		},
		search() {
			var that = this;
			that.Net._get('is_qd',{},(res)=>{
				if(res.code ==1){
				uni.navigateTo({
					url: '/pages/list/list?type=4'
				});
				}
			});
			
		},
		search1() {
			var that = this;
			that.Net._get('is_fg',{},(res)=>{
				if(res.code ==1){
				uni.navigateTo({
					url: '/pages/list/list?type=1'
				});
				}
			});
		},
		onBackPress(e){
		  console.log("监听返回按钮事件",e);
		 uni.reLaunch({
		 	url:'/pages/index/index'
		 })
		  // 此处一定姚要return为true，否则页面不会返回到指定路径
		  return true;
		},
		search2() {
			var that = this;
			that.Net._get('is_gd',{},(res)=>{
				if(res.code ==1){
				uni.navigateTo({
					url: '/pages/personal/total'
				});
				}
			});
		},
		setSign(){
			
			let me = this;
			
			me.Net._get('sign',{},(res)=>{
				if(res.code ==1){
					me.sign = true;
					uni.showToast({
						title:res.msg,
						icon:"none",
						
					})
				}
				else
				{
					uni.showToast({
						title:res.msg,
						icon:"none",
						
					})
				}
			});
		},
		openPhone() {
			
			let this_ = this;
				
			uni.showModal({
				title: '客服热线',
				content:this_.phone,
				success: function(res) {
					if (res.confirm) {
						//console.log('用户点击确定');
						uni.makePhoneCall({
							phoneNumber: this_.phone //仅为示例
						});
					} else if (res.cancel) {
						//console.log('用户点击取消');
					}
				}
			});
		},
		backPage() {
			uni.navigateBack();
		},
		gotopage(e) {
			let url = e.currentTarget.dataset.url;
			uni.navigateTo({
				url: url
			});
		},
		gotopage1(e) {
			let url = e.currentTarget.dataset.url;
			uni.switchTab({
				url: url
			});
		},
		gotopage12(e) {
			uni.showToast({
			    title:'暂未开放',
					icon:"none",
			})
		},
		
		pupuShow() {
			this.pupu_show = !this.pupu_show;
		},
		paste() {
			var value = this.name.tj_code;
			uni.setClipboardData({
				data: value
			});
		},
		openImg() {
			let me = this;
			uni.showModal({
			    title: '提示',
			    content: '是否修改头像',
			    success: function (res) {
			        if (res.confirm) {
			            //console.log('用户点击确定');
						uni.chooseImage({
							count: 1, //默认9
							
							sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
							sourceType: ['album'], //从相册选择
							success: function(chooseImageRes) {
								const tempFilePaths = chooseImageRes.tempFilePaths
								pathToBase64(tempFilePaths[0])
														.then(base64 => {
														 
															me.Net._post('upAvatara',{avatar:base64},(res)=>{
																if(res.code ==1){
																me.name.avatar=res.data
															
																}
															});
														 })
														 .catch(error => {
														 });
												
							}
						});
						
						
			        } else if (res.cancel) {
			            //console.log('用户点击取消');
			        }
			    }
			});
		
		},
		exitFun(){
			let that = this;
			uni.showModal({
			    title: '提示',
			    content: '是否退出当前账号',
			    success: function (res) {
			        if (res.confirm) {
						that.Net._setToken('');
						uni.reLaunch({
							url:'/pages/public/login'
						})
					}else if (res.cancel) {
			            //console.log('用户点击取消');
			        }
				},
			})
		}
	}
};
</script>

<style lang="scss">
page{
	background-color: #f8f8f8;
	padding-bottom: 0 !important;
}
.status_bar03 {
	height: var(--status-bar-height);
	width: 100%;
	background: #4d726f;
	position: fixed;
	top: 0;
	z-index: 9999;
}
.main01{
	width: 100%;
	margin: auto;
	position: relative;
	height: 60vw;
}
.main01 .beig{
	position: absolute;
	width: 100%;
}
.main01 .wrap{
	position: absolute;
	z-index: 99;
	width: 100%;
}
.main01 .bg_img{
	position: absolute;
	z-index: 1;
	width: 100%;
	height: 69vw;
}
.main01 .she{
	text-align: left;
	color: #fff;
	width: 92%;
	margin: auto;
	font-size: 6vw;
	padding-top: 9vw;
}
.main01 .a01{
	width: 92%;
	margin: 2vw auto 0vw;
	display: flex;
	position: relative;
	align-items: center;
}
.main01 .a01 .head{
	
}
.main01 .a01 .head image{
	width: 20vw;
	height: 20vw;
	border-radius: 50%;
	border: 2px solid #fff;
}
.main01 .a01 .swtch_box{
	top: 30rpx;
	position: absolute;
	color: #FFFFFF;
	width: 80rpx;
	text-align: center;
	right: 0;
}
.main01 .a01 .swtch_box .sign{
	font-size: 45rpx;
}
.main01 .a01 .swtch_box .img{
	width: 5vw;
}
.main01 .a01 .swtch_box .text{
	font-size: 26rpx;
	margin-top: 10rpx;
}

.main01 .b01{
	width: 75%;
	margin-left: 2vw;
	/* overflow: hidden; 
	white-space: nowrap;
	text-overflow: ellipsis;*/
}
.main01 .b01 .title{
	display: flex;
	align-items: center;
	padding-top: 10rpx;
	flex-wrap: wrap;
}
.main01 .b01 .title .name{
	color: #ffffff;
	font-size: 6vw;
	font-weight: bold;
	
}
.main01 .b01 .title .name2{
	color: #ffffff;
	font-size: 4vw;
	font-weight: bold;
}
.main01 .b01 .title .user{
	font-size: 5vw;
}
.main01 .b01 .title .grade{	
	color: #4d726f;
	border-radius: 2vw;
	padding: 0.2vw 2vw;
	font-size: 3vw;
	margin-left: 1vw;
	margin-top: 1vw;
	background: #fff;

}

.main01 .b01 .title .edit{
	color: #fff;
	font-size: 3vw;
	margin-top: 2vw;
}

.jindu{
	width: 100%;
	display: flex;
}
.progress-box{
	background-color:#504a4e;
	width:100%;
	height:12px;
	border-radius:12px;
	margin:3vw 0vw;
	display:flex;
	justify-content:flex-start ;
}
.progress-box .pro{
	background-image: linear-gradient(#fed984, #fcb40a);
	/* width:45%; */
	height:12px;
	border-radius:12px;
}
.percent{
	font-size: 3.5vw;
	color: #fff;
	width: 20vw;
	padding-top: 2vw;
	margin-left: 3vw;
}
.total_amount{
	width: 92%;
	margin-left: 4%;
	background: #ffffff;
	margin-top: 5vw;
	border-radius: 15rpx;
	padding: 4vw 5vw;
	color: #4d726f;
	display: flex;
	align-items: center;
	.t_t1{
		font-size: 30rpx;
		font-weight: bold;
	}
	.t_t2{
		font-size: 36rpx;
		flex: 1;
		font-weight: bold;
	}
	.btn{
		font-size: 26rpx;
		padding: 5rpx 18rpx;
		background: #ffffff;
		color: #4d726f;
		border: 1rpx solid #4d726f;
		border-radius: 10rpx;
	}
}
.main01 .a02{
	width: 92%;
	margin-left: 4%;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	margin-top: 3vw;
	background: #ffffff;
	border-radius: 15rpx;
	padding: 5rpx 0 25rpx;
}
.main01 .a02 .kuai{
	width: 33.3%;
	text-align: center;
	margin-top: 20rpx;
}
.mkbg{
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	.tub{
		font-size: 33rpx;
		color: #4d726f;
		margin-top: 10rpx;
		padding-right: 10rpx;
	}
	.text{
		font-size: 3.5vw;
		color: #4d726f;
		padding-top: 1vw;
	}
}
.main01 .a02 .kuai .zimu{
	padding-top: 10rpx;
	font-size: 4vw;
	color: #4d726f;
	font-weight: bold;
}
.a02{
	.total{
		width: 92%;
		padding: 20rpx;
		border-radius: 15rpx;
		background: #ffffff;
		display: flex;
		align-items: center;
		font-size: 32rpx;
		font-weight: bold;
		color: #4d726f;
		.logo{
			font-size: 40rpx;
			padding-right: 20rpx;
		}
		.num{
			font-size: 46rpx;
		}
	}
}


.nav {
	width: 100%;
	padding: 14vw 0 30rpx;
	background: #fff;
	/* margin: 3vw auto 3vw; */
}

.nav02{
	padding-top: 10rpx;
}

.nav .title_box {
	width: 96%;
	height: 8vw;
	line-height: 8vw;
	position: relative;
	margin: auto;
}

.nav .title_box .text {
	font-size: 4vw;
	color: #333;
	font-weight: bold;
	position: absolute;
	left: 16px;
	line-height: 20px;
}

.nav .title_box .arrow_box {
	position: absolute;
	right: 16px;
	display: flex;
}

.nav .title_box .arrow_box .t {
	font-size: 12px;
	color: #666;
	line-height: 20px;
}

.nav .title_box .arrow_box .arrow {
	font-size: 12px;
	color: #666;
	line-height: 20px;
}

.nav .menu_box {
	width: 96%;
	display: flex;
	margin:15px auto 0px;
	flex-wrap: wrap;
	border-bottom: 1px solid #f5f5f5;
	padding-bottom: 3vw;
}

.nav .menu_box .menu {
	width: 25%;
	text-align: center;
	margin-bottom: 4vw;
	position: relative;
}
.nav .menu_box .chunk {
	width: 33%;
	text-align: center;
}
.nav .menu_box .menu02 {
	width: 20% !important;
}

.nav .menu_box .menu .round {
	width: 4.5vw;
	height: 4.5vw;
	border-radius: 50%;
	background-color: #f00;
	color: #fff;
	font-size: 3vw;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	right: 5vw;
	top: -1vw;
	z-index: 98;
}

.nav .menu_box .menu .icon {
	width: 10vw;
	height: 10vw;
	margin: auto;
}
.nav .menu_box .menu .icon image{
	width: 100%;
}
.nav .menu_box .chunk .icon01 {
	font-size: 6.5vw;
	margin: auto;
}
.nav .menu_box .menu .text01 {
	font-size: 3.8vw;
	color: #000;
	text-align: center;
	margin-top: 2vw;
}
.nav .menu_box .chunk .text {
	font-size: 12px;
	color: #000;
	text-align: center;
	margin-top: 5px;
	margin-bottom:4vw;
}
.content_box02 {
	width: 100%;
	background: #fff;
	margin: 0vw auto;
}

.content_box02 .list_box {
	width: calc(100% - 9%);
	height: 60px;
	margin-left: 25px;
	position: relative;
	display: flex;
	border-bottom: 1px solid #f5f5f5;
}

.content_box02 .list_box .icon {
	font-size: 20px;
	text-align: left;
	line-height: 60px;
	color: #000;
	width: 30px;
}

.content_box02 .list_box .text {
	font-size: 13px;
	color: #000;
	line-height: 60px;
}

.content_box02 .list_box .arrow {
	font-size: 14px;
	color: #999;
	line-height: 60px;
	position: absolute;
	right: 10px;
}
.contnt{
	width: 92%;
	margin:2vw auto;
	display: flex;
	justify-content: space-between;
	flex-wrap:  wrap;
}
.contnt .kuai{
	width: 48%;
}
.contnt .kuai .photo{
	width: 40vw;
	height: 40vw;
	margin: 2vw auto 0vw;
	overflow: hidden;
	line-height: 40vw;
}
.contnt .kuai .photoimage {
	width: 100%;
	height: 100%;
	display: inline-block;
	vertical-align: middle;
}
.contnt .kuai .text {
	color: #000;
	font-size: 4vw;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 90%;
	margin: 1vw auto;
}


.product {
	width: 100%;
}

.public-title {
	color: #221b15;
	font-size: 36upx;
	font-weight: bold;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 94%;
	margin-left: 3%;
	padding-left: 30upx;
	margin-top: 40upx;
	.text{
		color: #666666;
		font-size: 24upx;
	}
}
.public-title::after {
	content: '';
	position: absolute;
	left: 0;
	top: 3px;
	height: 36upx;
	width: 8upx;
	border-radius: 5upx;
	background-color: #4d726f;
}

.popular .info {
	width: 94%;
	margin: auto;
	display: flex;
	justify-content: space-between;
	height: 10vw;
	line-height: 10vw;
}
.popular .info .title {
	display: flex;
}
.popular .info .title .hot {
	color: #fc5c39;
	font-size: 5vw;
}
.popular .info .title .text {
	font-size: 4.2vw;
	color: #333;
	padding-left: 1vw;
	font-weight: bold;
}
.popular .info .more {
	color: #999;
	font-size: 3vw;
}
.popular .content {
	width: 100%;
	overflow: hidden;
	margin: auto;
}
.auto_box {
	width: inherit;
	display: flex;
	flex-wrap: nowrap;
	overflow-x: auto;
}
.popular .content .fabric {
	width: 30%;
	margin-left: 4%;
}
.popular .content .tupian {
	width: 30vw;
	height: 27vw;
	margin: auto;
}
.popular .content .tupian image {
	width: 100%;
	height: 100%;
}
.popular .content .biao {
	font-size: 3.5vw;
	color: #666;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	padding-top: 1.5vw;
}
.popular .content .zhtai {
	display: flex;
	justify-content: space-between;
	height: 9vw;
	line-height: 9vw;
}
.price {
	color: #fa3443;
	font-size: 28upx;
	font-weight: bold;
}
.gou {
	width: 56upx;
	height: 56upx;
	line-height: 58upx;
	text-align: center;
	border-radius: 50%;
	color: #ffffff;
	background-color: #f80000;
	font-size: 26upx;
	margin-top: -16upx;
}
.product {
	width: 100%;
}
.product .info {
	height: 10vw;
	line-height: 10vw;
	width: 100%;
	display: flex;
}
.product .info .title {
	width: 100%;
	text-align: center;
	font-size: 4.2vw;
	color: #000;
	font-weight: bold;
}
.product .info .more {
	position: absolute;
	right: 2vw;
	font-size: 5vw;
	color: #999;
}
.product .content {
	width: 92%;
	margin: auto;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding-bottom: 3vw;
}
.product .content .kuai {
	width: 48%;
	margin-top: 3vw;
}
.product .content .photo {
	width: 100%;
	height: 168px;
	overflow: hidden;
	line-height: 40vw;
}
.product .content .photo image {
	width: 100%;
	height: 100%;
	display: inline-block;
	vertical-align: middle;
}
.product .content .text {
	color: #000;
	font-size: 4vw;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 90%;
	margin: 1vw auto;
}

.product .content .zhtai {
	display: flex;
	justify-content: space-between;
	height: 7vw;
	line-height: 7vw;
	width: 96%;
	margin: auto;
}
.product .content .taime {
	width: 90%;
	margin: 1vw auto 0vw;
	display: flex;
	justify-content: space-between;
}
.product .content .taime .wn01 {
	font-size: 3vw;
	color: #999;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 50%;
}
.product .content .taime .wn02 {
	font-size: 3vw;
	color: #fff;
	background-color: #000;
	border-radius: 50vw;
	text-align: center;
	padding: 2px 5px;
}

.footer{
	width: 100%;
	padding: 40rpx 5% 50rpx;
	background: #FFFFFF;
	.footer_btn{
		width: 100%;
		height: 85rpx;
		background: #4d726f;
		font-size: 34rpx;
		color: #FFFFFF;
		border-radius: 50rpx;
		line-height: 85rpx;
		text-align: center;
	}
}
.footer2{
	padding-top: 5vh;
	padding-bottom: 3vw;
	width: 100%;
	text-align: center;
	font-size: 22rpx;
	color: #999;
	background: #ffffff;
}
</style>
